<template>
  <div class="overview">
    <div class="info">
      <img :src="overviewOption.userHead" id="userHead">
      <div class="experience">
        <!--<span id="experience">5</span>&nbsp年股龄-->
      </div>
      <div class="fans">
        <img src="~assets/images/lianjie@3x.png">
        <div>
          <div class="one">TA被订阅</div>
          <div class="two">
            <i class="iconfont icon-xin"></i>
          </div>
          <div class="three" id="subscribeUserCount">{{overviewOption.subscribeUserCount}}人</div>
        </div>
      </div>
      <div class="sub clearfix">
        <img src="~assets/images/lianjie@3x.png">
        <div>
          <div class="one">TA订阅了</div>
          <div class="two">
            <i class="iconfont icon-dingyue"></i>
          </div>
          <div class="three" id="mySubscribeCount">{{mySubscribeCount}}人</div>
        </div>
      </div>
    </div>

    <div class="one">
      <div>
        <span class="nickname" id="nickname">{{overviewOption.nickname}}</span>

        <div class="features">
          <span id="features" :style="overviewOption.features == '' ? 'background-color: transparent !important' : ''">{{overviewOption.features}}</span>
        </div>
      </div>

      <div class="gross-rate" :class="totalRate<0?'negative':'positive'">
        <div>总盈利率</div>
        <div id="totalRate">{{totalRate}}%</div>
      </div>
    </div>

    <table class="table two">
      <td class=''>
        <div class="key">
          <div>持股盈亏</div>
          <div class="totalprofit">总资产</div>
        </div>

        <div class="value">
          <div id="totalFloatProfit" :class="totalFloatProfit<0?'negative':'positive'">{{totalFloatProfit}}</div>
          <div id="fundBalance">{{fundBalance}}</div>
        </div>
      </td>

      <td  @click.stop.prevent="toMedalsWall">
        <medals-owned :medalsProps="medalsOwned" :userType="'other'"></medals-owned>
      </td>
    </table>
  </div>
</template>

<script>
  import RemoteDAO from 'common/remoteDAO'
  import CommonUtil from 'common/common.util'
  import LocalDAO from 'common/localDAO'
  import MedalsOwned from 'components/dynamic/MedalsOwned'
  import Constant from 'common/constant'
  import _ from 'underscore'

  export default {
    data () {
      return {
        mySubscribeCount: '--', //我的订阅数
        totalRate: '--', // 总盈利率
        totalFloatProfit: '--', // 持股盈亏
        fundBalance: '--', // 总资产
        testData: 'testData'
      }
    },
    props: {
      overviewOption: {
        type: Object
      },
      medalsOwned: {
        type: Object
      },
      clientId: {
        type: String
      }
    },
    components: {
      'medals-owned': MedalsOwned
    },
    watch: {
      '$route.query.userCode' (to, from) {
        //跳转相同页面，组件不重新构建，无法调用created,故需监听
        this.fetchData ()
      }
    },
    created: function () {
      this.fetchData()
    },
    methods: {
      fetchData(){
        var self = this;
        //查询用户资产
        RemoteDAO.callJCL11103(self.clientId, function (response) {
          if (Number(response.error) === 0) {
            var data = response.data.body.data;

            if (typeof(data) !== 'undefined' && data.length > 0) {
              var totalRate = CommonUtil.toFixed(data[0].total_rate, 2); // 总盈利率
              var fundBalance = CommonUtil.toFixed(data[0].fund_balance, 2); // 模拟资产
              var totalFloatProfit = CommonUtil.toFixed(data[0].total_floatprofit, 2); // 累计盈亏
              self.totalFloatProfit = totalFloatProfit>=0?"+"+totalFloatProfit:totalFloatProfit
              self.totalRate = totalRate>=0?"+"+totalRate:totalRate;
              self.fundBalance = fundBalance;

              // 更新分享页数据
              var shareOtherDetails = LocalDAO.getShareOtherDetails();
              shareOtherDetails.overview.totalRate = totalRate + "%";
              shareOtherDetails.overview.fundBalance = fundBalance;
              shareOtherDetails.overview.totalFloatProfit = totalFloatProfit;
              LocalDAO.setShareOtherDetails(shareOtherDetails);

            }
          }else{
            self.$store.dispatch('setTip',{text:response.data});
          }
        });

        // 查询订阅的人数
        var args = {};
        args.USER_CODE = self.clientId;
        args.COMMUNITY_STATUS = "1";
        args.COMMUNITY_TYPE = "3"; // 订阅
        RemoteDAO.callUC12008314(args, function (response) {
          if (Number(response.error) === 0) {
            if (response.data.body.length > 0) {
              self.mySubscribeCount = response.data.body[0].MY_SUBSCRIBE_COUNT;

              // 更新分享页数据
              var shareOtherDetails = LocalDAO.getShareOtherDetails();
              shareOtherDetails.overview.mySubscribeCount = self.mySubscribeCount;
              LocalDAO.setShareOtherDetails(shareOtherDetails);
            }
          } else {
            self.$store.dispatch('setTip', {text: "UC12008314:"+response.data});
          }
        });

      },
      toMedalsWall (e) {
        var self = this;
        self.$router.push({path: '/medalswall', query: {userType: Constant.user.OTHER}});
      }
    }
  }
</script>

<style scoped>

</style>
